<template lang="html">
  <div class="imgText2">
    <div class="imgs2">
      <img :src="obj.imageUrl" alt="">
      <div class="text2">
        <span>{{ obj.title }}</span>
        <span>{{ obj.subTitle }}</span>
      </div>
    </div>

  </div>
</template>

<script>
export default {
  props:['obj']
}
</script>

<style lang="css">
  .imgText2{
    /*margin:0.3rem 0 0 0.5rem;*/
  }
  .imgText2:last-child{
    /*align-self: flex-start;*/
  }
  .imgs2{
    position: relative;
  }
  .imgs2 img{
    width: 100%;
    border-radius: 5%;
  }
  .text2{
    color: #fff;
    text-align: left;
    position: absolute;
    bottom: 0.2rem;
    left: 0.5rem;
  }
  .text2 span{
    display: block;
  }
  .text2 span:nth-of-type(1){
    font-size: 1.8rem;
    margin-bottom: 0.1rem;
  }
  .text2 span:nth-of-type(2){
    font-size: 1.3rem;
  }
</style>
